<script setup lang="ts">
import { dissolveCommunity } from '@/api/community';
import YHeader from '@/components/YHeader.vue';
import { router } from '@/router';
import { showDialog } from 'vant';
import { onMounted, ref } from 'vue';
import { useRoute } from 'vue-router';

const communityId = ref();

onMounted(() => {
    const route = useRoute();
    const id = route.query.id;
    if (id != undefined && !Array.isArray(id)) {
        communityId.value = id;
    }
})

const dissolve = () => {
    showDialog({
        message: '你确定要解散吗？',
        showCancelButton: true,
        closeOnClickOverlay: true
    }).then(() => {
        dissolveCommunity(communityId.value).then(() => {
            router.push("/community");
        })
    }).catch(() => {

    });
}

</script>

<template>
    <div class="container">
        <YHeader></YHeader>
        <div class="button">
            <van-button type="danger" @click="dissolve">解散社区</van-button>
        </div>
    </div>
</template>

<style lang="scss" scoped>
.button {
    width: 80%;
}

</style>